var endtime = new Date('2019-9-18 19:00:00');


//设置当前的秒数
var shi = 0;
var fen = 0;
var miao = 0;


function seckill() {
    //获取当前的时间
    var nowtime = new Date();

    //获取相差的时间
    var disparity = endtime.getTime() - nowtime.getTime();

    //相差的毫秒数
    //console.log(disparity);
    //相差的秒数
    disparity = disparity / 1000;
    //console.log(disparity);

    //取整
    disparity = parseInt(disparity);

    if (disparity >= 0) {
        //根据剩余的秒数，算出剩余的小时
        shi = parseInt(disparity / 3600);

        //根据剩余的秒数，算出剩余的分钟
        fen = parseInt((disparity / 60) % 60);

        //根据剩余的秒数，算出剩余的秒数
        miao = parseInt(disparity % 60);


        if (shi < 10) {
            shi = '0' + shi;
        }
        if (fen < 10) {
            fen = '0' + fen;
        }
        if (miao < 10) {
            miao = '0' + miao;
        }
    } else {
        //console.log('秒杀结束');
        clearInterval(t);
    }
    document.querySelector("#shi").innerHTML = shi;
    document.querySelector("#fen").innerHTML = fen;
    document.querySelector("#miao").innerHTML = miao;
}
seckill();

var t = setInterval(function () {
    seckill();
}, 1000)

//第几个json
var page = 1;
function loadXMLDoc() {
    var xmlhttp;
    if (window.XMLHttpRequest) {
        //  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
        xmlhttp = new XMLHttpRequest();
    }
    else {
        // IE6, IE5 浏览器执行代码
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            //转成数值类型的json
            var json = JSON.parse(xmlhttp.responseText);
            console.log(json.employees);
            for (let i = 0; i < json.employees.length; i++) {
                console.log(json.employees);
                //创建HTML结构
                //图片
                var img = document.createElement('img');
                img.src = json.employees[i].pic;
                //图片外层的div
                var div1 = document.createElement("div");
                div1.appendChild(img);
                
                console.log(div1);

                //h3标签
                var h3 = document.createElement('h3');
                h3.innerHTML = json.employees[i].h;
                //前5000件19.90元
                var p1 = document.createElement('p');
                p1.innerHTML = json.employees[i].q;
               //那个进度条
                var span1 = document.createElement('span');
                var p2 = document.createElement('p');
                p2.appendChild(span1);
                // 18% 
                var span2 = document.createElement('span');
                span2.innerHTML = json.employees[i].shu;
                //已抢的
                var span3 = document.createElement("span");
                span3.innerHTML = json.employees[i].yi;
                //18% 已抢的外层p
                var p3 = document.createElement('p');
                p3.appendChild(span2);
                p3.appendChild(span3);
                //价钱外面的p标签
               
               //价钱 26.9
                var span4 = document.createElement('span');
                span4.innerHTML = json.employees[i].qian;
                //120
                var span5 = document.createElement("span");
                span5.innerHTML = json.employees[i].hui;
                //价格外层的p
                var p4 = document.createElement('p');
                p4.appendChild(span4);
                p4.appendChild(span5);
                // h3 、p 的外层div
                var div2 = document.createElement('div');
                div2.appendChild(h3);
                div2.appendChild(p1);
                div2.appendChild(p2);
                div2.appendChild(p3);
                div2.appendChild(p4);
                var div = document.createElement('div');
                div.appendChild(div1);
                div.appendChild(div2);
                console.log(div);

                document.querySelector("#cl").appendChild(div);

            }

        }
    }
    xmlhttp.open("GET", "json/"+ page +".json", true);
    xmlhttp.send();
}
loadXMLDoc()


document.querySelector("#huan").addEventListener('click',function(){
    
    if(page >= 4){
        page = 1;
    }else{
        page++;
    }
    //先清空
    document.querySelector('#cl').innerHTML ='';
    //再取数据放到list里面
    loadXMLDoc()
})
